import React, { useState, useEffect } from 'react'
import { NavBar, Toast, Typography, Input, Cell, Checkbox, Form } from 'react-vant'
import { Location, HotSale } from '@react-vant/icons'
import { useNavigate, useLocation } from 'react-router-dom'


import 'animate.css';

import "../css3/issue3.scss"


export default function Issue3() {
  const [obj, setObj] = useState(useLocation().state)
  console.log('====================================');
  console.log(obj);
  console.log('====================================');

  const [value, setValue] = useState(''); //价钱  打折后的价钱
  const [value2, setValue2] = useState(''); //原价
  const [value3, setValue3] = useState(''); //运费

  let navigate = useNavigate()
  return (
    <div className='issue3 animate__animated animate__flip'>
      {/* 返回 */}
      <NavBar
        title="发布"
        onClickLeft={() => Toast('返回', navigate('/sellbook3'))}
      />



      <div>

        <div className='fabu'>
          <div className='zuo'>
            <img src={obj.image} alt="" />

          </div>

          <div className='you'>
            <h4 style={{ marginBottom: "5px", marginTop: "5px" }}>{obj.author}</h4>
            <p style={{ color: "black", fontSize: "13px" }}>
              <Typography.Text ellipsis={3}>{obj.describe}</Typography.Text>

            </p>

            <div className='dazhe'>
              <p style={{ color: "black", fontSize: "12px" }}><HotSale />{obj.pinxiang}</p>
              <p style={{ color: "black", fontSize: "12px" }}><Location />{obj.location}</p>
            </div>









          </div>
        </div>
      </div>




      <div className='jia'>
        <Cell>
          <Input
            placeholder="￥"
            value={value}
            onChange={setValue}
            clearable
            clearTrigger="always"
          />
        </Cell>

        <Cell>
          <Input
            placeholder="原价"
            value={value2}
            onChange={setValue2}
            clearable
            clearTrigger="always"
          />
        </Cell>



        <div className='baoyou'>
          <Cell>
            <Input
              placeholder="运费"
              value={value3}
              onChange={setValue3}
              clearable
              clearTrigger="always"
            />
          </Cell>
          <Form>
            <Form.Item label='包邮' valuePropName='checked'>
              <Checkbox shape='square' />
            </Form.Item>

          </Form>


        </div>




        <div className='ziti'>
          <Form>
            <Form.Item label='支持自提' valuePropName='checked'>
              <Checkbox shape='square' />
              <p>自提免邮费</p>
            </Form.Item>

          </Form>



        </div>


      </div>





      <div>
        <button className='fabu1'
          // onClick={async () => {
          //         let { data: { code } } = await axios.post("/lsj/wadd", { wcontent: value1, wpip: defaultValue[0].url })
          //         if (code === 200) {
          //           Toast.success('出价成功')
          //           navigate('/home')
          //         }
          //       }}
          onClick={async () => {
            let obj1 = { ...obj, freight: value3, price: value2, nowprice: value }
            let { data: { code } } = await axios.post("/add", obj1)
            if (code === 200) {
              Toast.success('发布成功')
              navigate('/success3')
            }
          }}
        >发布</button>
      </div>


    </div>
  )
}
